<!DOCTYPE html>
<html lang="zh-CN">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="robots" content="all">
    <meta name="author" content="Tencent-CP">
    <meta name="Copyright" content="Tencent">
    <meta name="description"
          content=""/>
    <meta name="keywords"
          content=""/>
    <title>道具</title>
    <link rel="stylesheet" type="text/css" href="Public/Static/Lol/css/index.css"/>
    <link rel="stylesheet" href="Public/Plug/layui/css/layui.css" media="all">
    <style>
        .main {
            width: 100%;
            margin: 0 auto;
            background: #fff;
            padding: 20px 20px 0;
        }

        .main .top {
            width: 100%;
            display: flex;
            flex-wrap: wrap;
        }

        .main .top li {
            width: 80px;
            height: 80px;
            margin-bottom: 10px;
            margin-right: 20px;
            /*display: flex;*/
            justify-content: center;
            margin-top: 10px;
            align-items: center;
        }

        .main .top li img {
            display: block;
            width: 80px;
            height: 80px;
        }

        li.active img {
            border: 4px solid red;
        }

        #hero-list div {
            display: block;
        }

        #formulas-list {
            padding: 10px;
        }

        /*#formulas-list div{
            display: block;
        }*/
        #baseimage-list li {
            width: 80px;
            height: 80px;
            border: 1px solid black;
        }
    </style>
</head>
<body style="background: #fff;">
<blockquote class="layui-elem-quote">
    <div class="test-table-reload-btn layui-inline" style="margin-bottom: 10px;">
        <form action="">
            搜索道具名称：
            <div class="layui-inline">
                <input class="layui-input" type="hidden" name="route" value="Equip/index">
                <input class="layui-input" type="hidden" name="iActId" value="1001">
                <input class="layui-input base-search-input" name="keyword" value="{$keywords}">
                <input type="hidden" name="keywordsType" value="{$keywordsType}">
            </div>
            <button class="layui-btn">搜索</button>
            <button type="button" class="layui-btn layui-btn-primary equip-add">添加</button>
        </form>
    </div>
</blockquote>
<div class="main">
    <div style="margin-bottom: 20px;">
        <button type="button" class="layui-btn  tab_type1 layui-btn-radius">基础道具</button>
        <button type="button" class="layui-btn tab_type2 layui-btn-primary layui-btn-radius">合成道具</button>
    </div>
    {if $baseEquip}
    <div class="status status2 block_type1" style="display: block;">
        {foreach $baseEquip as $val}
        <div style="border: 1px solid #000;border-radius: 10px;margin: 0 50px 20px 0;" class="layui-inline">

            <form action="">
                <input type="hidden" value="1" name="is_update">
                <input type="hidden" value="1" name="type">
                <img style="width: 70px;height: 70px" src="{$val.imagePath}" alt="" class="layui-form-mid">

                <div class="layui-inline">
                    <label class="layui-form-label">道具ID</label>
                    <div class="layui-input-inline">
                        <input readonly type="text" name="equipId" class="layui-input" value="{$val.equipId}">
                    </div>
                </div>
                <br/>

                <div class="layui-inline" style="margin-top: 20px;">
                    <label class="layui-form-label">道具名称</label>
                    <div class="layui-input-inline">
                        <input name="name" class="layui-input" value="{$val.name}">
                    </div>
                </div>

                <div class="layui-form-item">
                    <button type="button"
                            class=" action-update-image update-image_{$val.equipId} layui-btn layui-btn-xs layui-btn-normal">
                        更换图标
                    </button>
                    <input type="hidden" name="imagePath" value="{$val.imagePath}">
                </div>
                <div class="layui-form-item">
                    <div class="layui-inline">
                        <label class="layui-form-label">效果</label>
                        <div class="layui-input-inline">
                            <input name="effect" class="layui-input" value="{$val.effect}">
                        </div>
                    </div>
                </div>
                <div class="layui-form-item">
                    <div class="layui-inline">
                        <label class="layui-form-label">关键词</label>
                        <div class="layui-input-inline">
                            <input name="keywords" class="layui-input" value="{$val.keywords}">
                        </div>
                    </div>
                </div>
                <div class="layui-form-item">
                    <div class="layui-inline">
                        <label class="layui-form-label">TFTID</label>
                        <div class="layui-input-inline">
                            <input type="number" name="TFTID" class="layui-input" value="{$val.TFTID}">
                        </div>
                    </div>

                </div>
                <!--            <div class="layui-form-item">-->
                <!--                <div class="layui-inline">-->
                <!--                    <label class="layui-form-label">适用英雄</label>-->
                <!--                    <div class="layui-input-inline">-->
                <!--                        <span class="hero-list">-->
                <!--                            {foreach $val.heros as $hero}-->
                <!--                                <a class="item_{$hero.key}">||{$hero.name}</a>-->
                <!--                             {/foreach}-->

                <!--                        </span>-->
                <!--                        <button class="select-hero" type="button" class="layui-btn layui-btn-sm">-->
                <!--                            <i class="layui-icon"></i>-->
                <!--                        </button>-->
                <!--                        <input type="hidden" name="heroIds" value="{$val.heroIds}" class="layui-input">-->

                <!--                    </div>-->
                <!--                </div>-->
                <!--            </div>-->
                <!--            <button type="button" class="action-to-update layui-btn layui-btn-normal" style="margin-left: 110px;">编辑</button>-->
                <button type="button" class="action-to-submit layui-btn layui-btn-danger"
                        style="margin-left: 110px; /*display: none*/">保存
                </button>
                <button type="button" class="action-to-delete layui-btn layui-btn-normal" style="margin-left: 10px;">
                    删除
                </button>

            </form>
        </div>
        {/foreach}
    </div>
    <div class="status status3 block_type2" style="display: none;">
        <ul class="top" id="baseimage-list">
            {foreach $baseEquip as $val}
            <li data-equipid="{$val.equipId}"><img src="{$val.imagePath}" alt="">
                <p>{$val.name}</p>
            </li>
            {/foreach}
        </ul>
        <blockquote class="layui-elem-quote" style="margin-top: 10px">
            <div class="test-table-reload-btn layui-inline" style="margin-bottom: 10px;">
                搜索道具名称：
                <div class="layui-inline">
                    <input class="layui-input" name="keyword" value="">
                    <input type="hidden" name="equipId">
                </div>
                <button class="layui-btn search-block2-btn">搜索</button>
            </div>
        </blockquote>
        <div id="type2-list">

        </div>

    </div>
    {else}
    <h2>暂无数据</h2>
    {/if}
</div>
</body>

<!--引用插件-->
<script type="text/javascript" src="Public/Plug/layui/layui.all.js"></script>
<script type="text/javascript" src="Public/Plug/jquery/jquery-3.3.1.min.js"></script>
<script src="Public/Static/Lol/js/equip.js?v=4"></script>
<script>
    var CONF = {};
    // CONF.Heros = {$selectHeros};
    CONF.Equips = {$selectEquips};

</script>
</html>